/*
  学习目标：React组价更新机制
  1. 父组件更新, 所有后代组件, 无脑更新
  2. 兄弟组件更新, 不会影响其它兄弟组件更新
*/

import React from 'react';
export default class App extends React.Component {
  render() {
    return (
      <div>
        <Footer></Footer>
        <Header></Header>
      </div>
    );
  }
}

class Header extends React.Component {
  componentDidUpdate() {
    console.log('Header被更新了  ----->  ');
  }
  render() {
    return <div></div>;
  }
}

class Footer extends React.Component {
  state = {
    count: 0,
  };

  handleClick = () => {
    this.setState({ count: this.state.count + 1 });
  };

  render() {
    return (
      <>
        <div>我是Footer</div>

        <button onClick={this.handleClick}>点我修改数量</button>
      </>
    );
  }
}
